<template>
  <div>
    <el-form :inline="true">
      <el-row>
        <el-col :span="6">
          <el-form-item label="公司名称：">
            <el-input v-model="selectData.companyName" placeholder="请输入公司名称" style="width: 240px"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="企业码：">
            <el-input v-model="selectData.companyCode" placeholder="请输入企业码" style="width: 240px"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="时间：">
            <el-date-picker v-model="selectData.data" type="daterange" range-separator="至" start-placeholder="开始日期"
              end-placeholder="结束日期" style="width: 240px">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-button type="primary">查询</el-button>
          <el-button type="primary">重置</el-button>
        </el-col>
      </el-row>
      <el-row>
        <el-form-item label="请选择状态：">
          <el-select v-model="options.value">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-row>
    </el-form>

    <!-- 表格 -->
    <el-table :data="tableData" stripe style="width: 100%">
      <el-table-column prop="date" label="公司名称"> </el-table-column>
      <el-table-column prop="name" label="营业执照"> </el-table-column>
      <el-table-column prop="companyCode" label="企业码"> </el-table-column>
      <el-table-column prop="prove" label="HR在职证明"> </el-table-column>
      <el-table-column prop="data" label="日期"> </el-table-column>
      <el-table-column prop="status" label="状态"></el-table-column>
    </el-table>

    <!-- 分页 -->
    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
      :page-sizes="[100, 200, 300, 400]" :page-size="100" layout="total, sizes, prev, pager, next, jumper" :total="400">
    </el-pagination>
  </div>
</template>

<script>
export default {
  data() {
    return {
      options: [
        {
          value: "全部",
          label: "全部",
        },
        {
          value: "待审核",
          label: "待审核",
        },
        {
          value: "已通过",
          label: "已通过",
        },
        {
          value: "未通过",
          label: "未通过",
        },
      ],

      currentPage: 1,
      selectData: {
        companyName: "",
        companyCode: "",
        data: "",
      },
      tableData: [
        {
          date: "厦门传一信息科技有限公司",
          name: "@/assets/login.png",
          companyCode: "112233",
          prove: "@/assets/login.png",
          data: "2025-08-14",
          status: "待审核",
        },
        {
          date: "厦门传一信息科技有限公司",
          name: "@/assets/login.png",
          companyCode: "112233",
          prove: "@/assets/login.png",
          data: "2025-08-14",
          status: "已通过",
        },
        {
          date: "厦门传一信息科技有限公司",
          name: "@/assets/login.png",
          companyCode: "112233",
          prove: "@/assets/login.png",
          data: "2025-08-14",
          status: "未通过",
        },
        {
          date: "厦门传一信息科技有限公司",
          name: "@/assets/login.png",
          companyCode: "112233",
          prove: "@/assets/login.png",
          data: "2025-08-14",
          status: "已通过",
        },
      ],
    };
  },
  methods: {
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
    },
  },
};
</script>

<style></style>